<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <link href="/static/css/css.css" rel="stylesheet" type="text/css"/>
    <link href="/static/css/common.css" rel="stylesheet" type="text/css"/>
    <link href="/static/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
    <script src="/static/js/jquery.min.1.8.2.js" type="text/javascript"></script>
    <script src="/static/js/jquery.SuperSlide.2.1.1.js" type="text/javascript"></script>
    <script type="text/javascript" src="/static/js/slider.js"></script>
    <script src="/static/js/common_js.js" type="text/javascript"></script>
    <script src="/static/js/jquery.foucs.js" type="text/javascript"></script>
   <script type="text/javascript" src="{{ static('js/host.js') }}"></script>
    <script type="text/javascript" src="{{ static('js/vue-2.5.16.js') }}"></script>
    <script type="text/javascript" src="{{ static('js/axios-0.18.0.min.js') }}"></script>
    <script type="text/javascript">
        let addresses = {{ addresses | safe }};
        {#let default_address_id = "{{ default_address_id }}";#}
    </script>
    <title>用户地址管理</title>
</head>

<body>
<div id="app" v-cloak>
    <!--顶部样式-->
    <div class="top_header">
        <em class="left_img"></em>
        <div class="header clearfix" id="header">
            <a href="#" class="logo_img"><img src="/static/images/logo.png"/></a>
            <div class="header_Section">
                <div class="shortcut">
                    <ul>
                        {% if user.is_authenticated %}
                            <li>
                                <a href="{{ url('users:usercenter') }}">{{ user.username }}</a>
                                <span>|</span>
                                <a href="{{ url('users:logout') }}">退出</a>
                            </li>

                        {% else %}

                            <li class="hd_menu_tit"><em class="login_img"></em><a href="{{ url('users:login') }}">登录</a>
                            </li>
                            <li class="hd_menu_tit"><em class="registered_img"></em><a
                                    href="{{ url('users:register') }}">注册</a></li>
                        {% endif %}

                        <li class="hd_menu_tit"><em class="Collect_img"></em><a href="#">收藏夹</a></li>
                        <li class="hd_menu_tit"><em class="cart_img"></em><a href="{{ url('shoppingcart:carts') }}">购物车（0）</a>
                        </li>
                        <li class="hd_menu_tit list_name" data-addclass="hd_menu_hover"><a href="#">网站导航</a><em
                                class="navigation_img"></em>

                            <div class="hd_menu_list">
                                <span class="wire"></span>
                                <ul>
                                    <li><a href="#">常见问题</a></li>
                                    <li><a href="#">在线退换货</a></li>
                                    <li><a href="#">在线投诉</a></li>
                                    <li><a href="#">配送范围</a></li>
                                </ul>
                            </div>
                        </li>
                    </ul>
                </div>
                <div class="nav" id="Navigation">
                    <ul class="Navigation_name">
                    <li class=""><a href="{{ url('index:index') }}">首页</a></li>
                    <li class=""><a href="#">所有果蔬</a></li>
                    <li class=""><a href="#">活动专区</a></li>
                    <li class=""><a href="{{ url('goods:fruit') }}">水果馆</a></li>
                    <li class=""><a href="{{ url('goods:shucai') }}">素菜馆</a></li>
                    <li class=""><a href="#">会员中心</a></li>
                    <li class=""><a href="#">联系我们</a></li>
                </ul>
                </div>
                <script>$("#Navigation").slide({titCell: ".Navigation_name li"});</script>
            </div>
        </div>
        <em class="right_img"></em>
    </div>
    <!---->
    <div><a href="#"><img src="/static/images/AD_page_img_02.png" width="100%"/></a></div>
    <!--位置-->
    <div class="Bread_crumbs">
        <div class="Inside_pages clearfix">
            <div class="right Search">
                <form>
                    <input name="" type="text" class="Search_Box"/>
                    <input name="" type="button" name="" class="Search_btn"/>
                </form>
            </div>
        </div>
    </div>
    <!--用户中心(地址管理界面)-->
    <div class="Inside_pages clearfix">
        <div class="clearfix user">
            <!--左侧菜单栏样式-->
            <div class="user_left">
                <div class="user_info">
                    <div class="Head_portrait"><img src="/static/images/product_img_17.png" width="80px" height="80px"/>
                        <!--头像区域--></div>
                    <div class="user_name">用户蜜甘草<a href="#">[个人资料]</a></div>
                </div>
                <ul class="Section">
                <li><a href="#"><em></em><span>我的特色馆</span></a></li>
                <li><a href="{{ url('users:usercenter') }}"><em></em><span>个人信息</span></a></li>
                <li><a href="{{ url('users:password') }}"><em></em><span>修改密码</span></a></li>
                <li><a href="{{ url('users:my_orders', args=(1,)) }}"><em></em><span>我的订单</span></a></li>
                <li><a href="#"><em></em><span>我的评论</span></a></li>
                <li><a href="#"><em></em><span>我的积分</span></a></li>
                <li><a href="#"><em></em><span>我的收藏</span></a></li>
                <li><a href="{{ url('users:address') }}"><em></em><span>收货地址管理</span></a></li>
            </ul>
            </div>
            <!--右侧内容样式-->
            <div class="user_right">
                <div class="user_Borders">
                    <div class="title_name">
                        <span class="name">地址管理</span>
                    </div>
                    <div class="about_user_info">
                        <form id="form1" name="form1" action=""  >
                            <div class="user_layout"  >
                                <ul>
                                    <li><label class="user_title_name">收件人姓名：</label><input v-model="form_address.receiver" id="receiver" name="receiver" type="text"
                                                                                            class="add_text"><em>*</em>
                                    </li>
{#                                    <li>#}
{#                                        <div class="form_group">#}
{#                                            <label>*所在地区：</label>#}
{#                                            <select v-model="form_address.province_id">#}
{#                                                <option v-for="province in provinces" :value="province.id">[[#}
{#                                                    province.name#}
{#                                                    ]]#}
{#                                                </option>#}
{#                                            </select>#}
{#                                            <select v-model="form_address.city_id">#}
{#                                                <option v-for="city in cities" :value="city.id">[[ city.name ]]</option>#}
{#                                            </select>#}
{#                                            <select v-model="form_address.district_id">#}
{#                                                <option v-for="district in districts" :value="district.id">[[#}
{#                                                    district.name#}
{#                                                    ]]#}
{#                                                </option>#}
{#                                            </select>#}
{#                                        </div>#}
{#                                    </li>#}
                                    <li><label class="user_title_name">收货地址：</label><input v-model="form_address.place" id="place" name="place"
                                                                                           type="text"
                                                                                           class="add_text"><em>*</em>
                                    </li>
                                    <li><label class="user_title_name">邮&nbsp;&nbsp;&nbsp;&nbsp;箱：</label><input v-model="form_address.email"
                                            id="email"
                                            name="email" type="text" class="add_text"><em>*</em>
                                    </li>
                                    <li><label class="user_title_name">手&nbsp;机&nbsp;号：</label><input v-model="form_address.mobile" id="mobile"
                                                                                                      name="mobile"
                                                                                                      type="text"
                                                                                                      class="add_text"><em>*</em>
                                    </li>
                                    <li><label class="user_title_name">固定电话：</label><input v-model="form_address.tel" id="tel" name="tel"
                                                                                           type="text"
                                                                                           class="add_text"></li>
                                </ul>
                                <div class="operating_btn"><input  id="bin" onclick="zengjia()" type="button" value="确认" class="submit—btn">
                                </div>
                            </div>
                        </form>
                    </div>
                    <!--地址列表-->
                    <div class="Address_List" >
                        <div class="title_name"><span class="name">用户地址列表</span></div>
                        <div class="list" >
                            <table >
                                <thead>
                                <td class="list_name_title0">收件人姓名</td>
                                <td class="list_name_title1">地区</td>
                                <td class="list_name_title2">邮箱</td>
                                <td class="list_name_title3">手机</td>
                                <td class="list_name_title4">收货地址</td>
                                <td class="list_name_title5">操作</td>
                                </thead >

                                {% for address in addresses %}
                                    <tr v-for="(address, index) in addresses"  >
                                        <td>{{ address.receiver }}</td>
                                        <td>{{ address.place }}</td>
                                        <td>{{ address.email }}</td>
                                        <td>{{ address.mobile }}</td>
                                        <td>{{ address.place }}</td>

                                        <td><a  href="#">修改</a><a  id="delete" @click="delete_address(index)">删除</a></td>

                                    </tr>
                                {% endfor %}


                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--底部样式-->
    <div class="footer">
        <div class="footer_img_bg"></div>
        <div class="footerbox">
            <div class="footer_info">
                <div class="footer_left">
                    <a href="#"><img src="/static/images/logo.png"/></a>
                    <p class="erwm">
                        <img src="/static/images/erweim.png" width="80px" height="80px"/>
                        <img src="/static/images/erweim.png" width="80px" height="80px"/>
                    <p>
                </div>
                <div class="helper_right clearfix">
                    <dl>
                        <dt><em class="guide"></em>新手指南</dt>
                        <dd><a href="#">注册新用户</a></dd>
                        <dd><a href="#">实名认证</a></dd>
                        <dd><a href="#">找回密码</a></dd>
                    </dl>
                    <dl>
                        <dt><em class="h_about"></em>关于我们</dt>
                        <dd><a href="#">关于我们</a></dd>
                        <dd><a href="#">政策服务</a></dd>
                        <dd><a href="#">常见问题</a></dd>
                    </dl>
                    <dl>
                        <dt><em class="h_conact"></em>联系我们</dt>
                        <dd><a href="#">联系我们</a></dd>
                        <dd><a href="#">在线客服</a></dd>
                    </dl>
                </div>
            </div>
        </div>
        <div class=" Copyright ">
            @2015 四川莆田特色馆版权所有
        </div>
    </div>
</div>
<script type="text/javascript" src="{{ static('js/common.js') }}"></script>
<script type="text/javascript" src="{{ static('js/base.js') }}"></script>
<script type="text/javascript" src="{{ static('js/user_center_site.js') }}"></script>
<script>
    function zengjia(){

        var receiver=$('#receiver').val();
        var place=$('#place').val();
        var email=$('#email').val();
        var mobile=$('#mobile').val();
        var tel=$('#tel').val();

        var data={'receiver':receiver,'place':place,'email':email,'mobile':mobile,'tel':tel};

        $.ajax({
            url:'/address/',
            data:data,
            dataType:'json',
            type:'POST',
            success:function () {
                alert('增加成功');
                window.location.reload()  //刷新当前页面
            }
        })
    }
    {#$('#bin').click(function () {#}
    {#    #}
    //{#});#}


</script>

</body>

</html>
